<template>
  <!-- 审批管理-我的审核-页面 -->
  <section class="page own-approval">
    <data-form :model="ownModel" @onSearch="refreshData" :page="pageService">
      <template slot="inputs">
        <el-form-item label="借据号" prop="caseNumber">
          <el-input v-model="ownModel.caseNumber"></el-input>
        </el-form-item>
        <el-form-item label="审核类型" prop="applyCategory">
          <el-select v-model="ownModel.applyCategory" size="small">
            <el-option v-for="{index,name,code} in $dict.getDictData('ApplyCategory').filter(x=> x.name !== '回收'&&x.name !== '人工扣划'&&x.name !== '抢案'&&x.name !== '抢案共享')" :key="index" :label="name" :value="code">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="申请人" prop="applyRealName">
          <el-input v-model="ownModel.applyRealName"></el-input>
        </el-form-item>
        <el-form-item label="审核人" prop="checkRealName">
          <el-input v-model="ownModel.checkRealName"></el-input>
        </el-form-item>
      </template>
    </data-form>

    <data-box :data="ownDataSet" @onPageChange="refreshData" :page="pageService">
      <template slot="columns">
        <el-table-column label="操作" :min-width="$helper.getColumnWidth(3)">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="approvalClick(scope)">{{scope.row.applyStatus==='PENDING'&& scope.row.commonFlag === 'YES'?'审批':'查看'}}</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="caseNumber" label="借据号" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
          <template slot-scope="scope">
            <a  @click="openExecutionPage(scope.row)">{{scope.row.caseNumber}}</a>
          </template>
        </el-table-column>
        <el-table-column prop="personalName" label="客户姓名" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="applyCategory" label="审核类型" :formatter="(row) => $filter.dictConvert(row.applyCategory,'ApplyCategory')" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="applyRealName" label="申请人" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="applyTime" label="申请时间" :formatter="(row) => $filter.dateTimeFormat(row.applyTime)" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="applyStatus" label="审核状态" :formatter="(row) => $filter.dictConvert(row.applyStatus,'ApplyStatus')" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="checkUserRealNameLinked" label="审核人" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="checkTime" label="审核时间" :formatter="(row) => $filter.dateTimeFormat(row.checkTime)" :min-width="$helper.getColumnWidth(3)" show-overflow-tooltip>
        </el-table-column>
      </template>
    </data-box>
    <el-dialog :title="$dict.getDictName(rowData.applyCategory,'ApplyCategory') + (rowData.applyStatus === 'PENDING'&& rowData.commonFlag === 'YES'?'审批':'查看')" :visible.sync="dialog.leaveApproval" width="600px" :close-on-click-modal="false" @close="$refs['case-approval-common'].reset()">
      <case-approval-common :dreateCaseData="dreateCaseData" @openViewAttachList="openViewAttachList" @openModifyConfig="openModifyConfig" ref='case-approval-common' :rowData="rowData" @close="dialog.leaveApproval=false;refreshData()"></case-approval-common>
    </el-dialog>
    <!-- 查看策略 -->
    <el-dialog title="查看策略" width="1050px" :center="true" :visible.sync="dialog.config" @open="$nextTick(()=>$refs['modify-config'].refresh())" @close="$refs['modify-config'].initData()">
      <modify-config :applyId="rowData.id" :isDisabled="true" @close="dialog.config = false" ref="modify-config"></modify-config>
    </el-dialog>
    <!-- 查看附件 -->
    <el-dialog title="附件信息" :center="true" :visible.sync="dialog.fileList" width="800px" append-to-body>
      <view-attach-list :fileIds="rowData.fileIds?rowData.fileIds:''" @close="dialog.fileList = false"></view-attach-list>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Auth, Layout, Dependencies } from '~/core/decorator';
import { PageService } from '~/utils/page.service';
import { SortService } from '~/utils/sort.service';
import DataForm from '~/components/common/data-form.vue';
import DataBox from '~/components/common/data-box.vue';
import { State, Getter,namespace } from 'vuex-class';
import { CaseApplyRecordService } from '~/services/domain-service/case-apply-record.service';
import CaseApprovalCommon from '~/components/approval-manage/own-approval/case-approval-common.vue';
import ModifyConfig from "~/components/system-manage/strategy-config/modify-config.vue";
import ViewAttachList from "~/components/common/view-attach-list.vue";
import { CASE_CHANNEL } from '~/config/enum.config';
import { OpenExecutionData } from "~/config/types";
const CollectionExecutionModule = namespace("collection-execution");

@Layout('workspace')
@Component({
  components: {
    DataForm,
    DataBox,
    CaseApprovalCommon,
    ModifyConfig,
    ViewAttachList
  },
})
export default class OwnApproval extends Vue {
  @Dependencies(PageService)
  private pageService: PageService;
  @Dependencies(SortService)
  private sortService: SortService;
  @Dependencies(CaseApplyRecordService)
  private caseApplyRecordService: CaseApplyRecordService;
  @CollectionExecutionModule.Action
  private openCollectionExecution;

  private ownModel: any = {
    caseNumber: '',
    applyCategory: '',
    applyRealName: '',
    checkRealName: '',
    applyStatus: '',
  };
  private rowData: string = '';
  private ownDataSet: any[] = [];
  private dreateCaseData: any[] = [];
  private dialog: any = {
    leaveApproval: false,
    config: false,
    fileList:false
  };
  private openModifyConfig(val){
    this.dialog.config = true
  }
  private openViewAttachList(val){
    this.dialog.fileList = true
  }
  private approvalClick(scope) {
    this.rowData = scope.row;
    this.dreateCaseData = []
    if(scope.row.waivers1){
      this.dreateCaseData.push({
        waivers:scope.row.waivers1,
        actualAmount:scope.row.actualAmount1,
        derateAmounts:scope.row.derateAmounts1
      })
    }
    if(scope.row.waivers2){
      this.dreateCaseData.push({
        waivers:scope.row.waivers2,
        actualAmount:scope.row.actualAmount2,
        derateAmounts:scope.row.derateAmounts2
      })
    }
    if(scope.row.waivers3){
      this.dreateCaseData.push({
        waivers:scope.row.waivers3,
        actualAmount:scope.row.actualAmount3,
        derateAmounts:scope.row.derateAmounts3
      })
    }
    this.dialog.leaveApproval = true;
  }
  /**
   * 进入查看执行页
   */
  private openExecutionPage(row) {
    console.log(row,"row")
    this.openCollectionExecution(
      new OpenExecutionData(
        row.caseId,
        row.caseNumber,
        CASE_CHANNEL.undistributed,
        true,
        true
      )
    );
  }
  private mounted() {
    this.refreshData();
  }
  private refreshData() {
    this.caseApplyRecordService
      .getAllCaseApplyRecords(this.ownModel, this.pageService, {
        applyTime: 'desc',
      })
      .subscribe((data) => {
        this.ownDataSet = data;
      });
  }
}
</script>

<style lang="less">
</style>
